<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>首页-工作台</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="icon" th:href="@{/resources/favicon.ico}">
    <link rel="stylesheet" th:href="@{/resources/layui/css/layui.css}" media="all"/>
    <link rel="stylesheet" th:href="@{/resources/css/public.css}" media="all"/>
    <link rel="stylesheet" th:href="@{/resources/css/index.css}" media="all"/>
</head>
<body class="childrenBody">
<blockquote class="layui-elem-quote layui-bg-green">
    <div id="nowTime"></div>
</blockquote>
<div style="margin-top: 15px; width:100%">
    <div class="layui-progress">
        <div class="layui-progress-bar" lay-percent="100%"></div>
    </div>
</div>
<div class="layui-row layui-col-space10">
    <!-- 数据表格开始 -->
    <div style="display: inline-block;width: 545px;height: 650px;float: left"><table class="layui-hide" id="loginfoTable" lay-filter="loginfoTable"></table></div>
    <!-- 数据表格结束 -->
    <div style="display: inline-block;width: 600px;height: 650px;float: left">
        <ul class="layui-timeline">
            <li class="layui-timeline-item">
                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                <div class="layui-timeline-content layui-text">
                    <h3 class="layui-timeline-title">2021年6月25日</h3>
                    <p>
                        文件上传【上传/下载/删除/刷新文件状态】功能已实现。
                        <br>点击下载的文件，将自动下载至电脑桌面；
                        <br>删除文件将同步删除数据库记录和服务器存储的文件。
                    </p>
                </div>
            </li>
            <li class="layui-timeline-item">
                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                <div class="layui-timeline-content layui-text">
                    <h3 class="layui-timeline-title">8月18日</h3>
                    <p>
                        layui 2.0 的一切准备工作似乎都已到位。发布之弦，一触即发。
                        <br>不枉近百个日日夜夜与之为伴。因小而大，因弱而强。
                        <br>无论它能走多远，抑或如何支撑？至少我曾倾注全心，无怨无悔 <i class="layui-icon"></i>
                    </p>
                </div>
            </li>
            <li class="layui-timeline-item">
                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                <div class="layui-timeline-content layui-text">
                    <h3 class="layui-timeline-title">8月16日</h3>
                    <p>杜甫的思想核心是儒家的仁政思想，他有“<em>致君尧舜上，再使风俗淳</em>”的宏伟抱负。个人最爱的名篇有：</p>
                    <ul>
                        <li>《登高》</li>
                        <li>《茅屋为秋风所破歌》</li>
                    </ul>
                </div>
            </li>
            <li class="layui-timeline-item">
                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                <div class="layui-timeline-content layui-text">
                    <h3 class="layui-timeline-title">8月15日</h3>
                    <p>
                        中国人民抗日战争胜利72周年
                        <br>常常在想，尽管对这个国家有这样那样的抱怨，但我们的确生在了最好的时代
                        <br>铭记、感恩
                        <br>所有为中华民族浴血奋战的英雄将士
                        <br>永垂不朽
                    </p>
                </div>
            </li>
            <li class="layui-timeline-item">
                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                <div class="layui-timeline-content layui-text">
                    <div class="layui-timeline-title">过去</div>
                </div>
            </li>
        </ul>
    </div>
</div>
<script type="text/javascript" th:src="@{/resources/layui/layui.js}"></script>
<script type="text/javascript">
    //得到当前登录人信息
    var UserName='[[${session.user.username}]]'
    //获取系统时间
    var newDate = '';
    getLangDate();
    //值小于10时，在前面补0
    function dateFilter(date){
        if(date < 10){return "0"+date;}
        return date;
    }
    function getLangDate(){
        var dateObj = new Date(); //表示当前系统时间的Date对象
        var year = dateObj.getFullYear(); //当前系统时间的完整年份值
        var month = dateObj.getMonth()+1; //当前系统时间的月份值
        var date = dateObj.getDate(); //当前系统时间的月份中的日
        var day = dateObj.getDay(); //当前系统时间中的星期值
        var weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
        var week = weeks[day]; //根据星期值，从数组中获取对应的星期字符串
        var hour = dateObj.getHours(); //当前系统时间的小时值
        var minute = dateObj.getMinutes(); //当前系统时间的分钟值
        var second = dateObj.getSeconds(); //当前系统时间的秒钟值
        var timeValue = "" +((hour >= 12) ? (hour >= 18) ? "晚上" : "下午" : "上午" ); //当前时间属于上午、晚上还是下午
        newDate = dateFilter(year)+"年"+dateFilter(month)+"月"+dateFilter(date)+"日 "+" "+dateFilter(hour)+":"+dateFilter(minute)+":"+dateFilter(second);
        document.getElementById("nowTime").innerHTML = "亲爱的【"+UserName+"】，"+timeValue+"好！ 欢迎使用档案管理系统。当前时间为： "+newDate+"　"+week;
        setTimeout("getLangDate()",1000);
    }

    layui.use(['form','element','layer','jquery','table'],function(){
        var table=layui.table;
        var form = layui.form;
        layer = parent.layer === undefined ? layui.layer : top.layer,
        element = layui.element;
        $ = layui.jquery;
        //上次登录时间【此处应该从接口获取，实际使用中请自行更换】
        $(".loginTime").html(newDate.split("日")[0]+"日</br>"+newDate.split("日")[1]);
        //icon动画
        $(".panel a").hover(function(){
            $(this).find(".layui-anim").addClass("layui-anim-scaleSpring");
        },function(){
            $(this).find(".layui-anim").removeClass("layui-anim-scaleSpring");
        })
        $(".panel a").click(function(){
            parent.addTab($(this));
        })
        var tableIns=table.render({
            elem: '#loginfoTable'
            ,url:'/loginfo/loadAllLoginfo'
            ,limit:'15'
            ,cols: [ [
                 {field:'id', title:'ID',align:'center',width:'80'}
                ,{field:'lloginname', title:'登录名信息',align:'center',width:'140'}
                ,{field:'lloginip', title:'登录IP地址',align:'center',width:'140'}
                ,{field:'llogintime', title:'登录时间',align:'center',width:'180'}
            ] ]
        });
    })
</script>
</body>
</html>
